*, body, html {
  margin: 0;
  padding: 0
}

abbr, footer>a, header>.container>.brand {
  text-decoration: none
}

.main, .panel-title, header, table {
  width: 100%
}

@font-face {
  font-family: icomoon;
  src: url(../fonts/icon.woff) format("woff");
  font-weight: 400;
  font-style: normal
}

@font-face {
  font-family: DIN;
  src: url(../fonts/DIN.woff) format("woff");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
  unicode-range: U+0020-F000
}

.cbi-button-down, .cbi-button-up, .cbi-value-helpicon, .main>.loading>span, .showSide {
  speak: none;
  font-style: normal!important;
  font-weight: 400!important;
  font-variant: normal!important;
  text-transform: none!important;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

* {
  box-sizing: border-box
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  font-family: inherit;
  font-weight: 400;
  line-height: 1;
  color: inherit
}

html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%
}

body, html {
  height: 100%;
  font-family: DIN, Helvetica, Arial, sans-serif
}

a, a:active, a:hover, a:link, a:visited {
  color: rgba(117, 137, 12, .75);
  text-decoration: none
}

input, select {
  background-color: #1f1e1a;
  color: #fff;
  border: 1px solid #4f4e4a;
  outline: 0;
  padding: 0;
  box-shadow: inset 0 0 12px #000;
  border-radius: 0;
  background-image: none;
  height: 1.9rem;
  font-size: 1rem
}

input {
  padding-left: 4px
}

input[type=checkbox], input[type=radio] {
  background: 0 0;
  box-shadow: none
}

input[type=file] {
  padding: 0!important;
  height: inherit
}

input:focus, select:not([multiple=multiple]):focus {
  border-color: rgba(117, 136, 12, .94)
}

select[multiple=multiple] {
  height: auto
}

code {
  color: #0f0e0a;
  text-shadow: none
}

hr {
  margin: 1rem 0;
  border-color: #1f1e1a;
  opacity: .1
}

header {
  height: 56px;
  background: url(../img/stripes.svg) #1f1e1a;
  color: #d8d3c5;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .26), inset 0 0 42px 0 #000;
  transition: box-shadow .2s;
  float: left;
  position: fixed;
  z-index: 101
}

header>.container {
  padding: 0 1rem;
  height: 56px;
  line-height: 56px
}

header>.container>.brand {
  font-size: 1.5rem;
  color: #d8d3c5;
  cursor: default;
  vertical-align: text-bottom
}

footer {
  text-align: right;
  padding: 1rem;
  color: #aaa;
  font-size: .8rem;
  text-shadow: 0 0 2px #BBB
}

.cbi-button, .cbi-section-table-cell, .cbi-section-table-row, .main>.loading>span {
  text-align: center
}

.main-right, .main>.main-left>.nav>li a {
  text-shadow: -1px 0 #1f1e1a, 0 1px #1f1e1a, 1px 0 #1f1e1a, 0 -1px #1f1e1a, 0 0 3px #1f1e1a
}

footer>a {
  color: #aaa
}

.main {
  top: 56px;
  bottom: 0;
  position: relative;
  height: 100%;
  height: calc(100% - 56px)
}

.main-left, .main>.loading {
  height: 100%;
  position: fixed
}

.main>.loading {
  width: 100%;
  z-index: 1000;
  display: block;
  background-color: #4f4e4a;
  top: 0
}

.main>.loading>span {
  display: block;
  margin-top: 20%;
  color: #d8d3c5;
  font-size: 2rem
}

.main>.loading>span>.loading-img:before {
  font-family: icomoon;
  content: "\e603"
}

.main>.loading>span>.loading-img {
  animation: anim-rotate 2s infinite linear;
  margin-right: 1rem;
  display: inline-block;
  color: rgba(117, 137, 12, 1)
}

@keyframes anim-rotate {
  0% {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0)
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg)
  }
}

.main-left {
  float: left;
  top: 56px;
  width: 15%;
  width: calc(0% + 15rem);
  height: calc(100% - 56px);
  color: #d8d3c5;
  background: #2f2e2a;
  background: linear-gradient(to bottom, #2f2e2a 0, #1f1e1a 100%);
  background: -webkit-linear-gradient(top, #2f2e2a 0, #1f1e1a 100%);
  overflow-x: auto
}

.main-right, .pull-right {
  float: right
}

.main-right {
  width: 85%;
  width: calc(100% - 15rem);
  height: 100%;
  font-size: .85rem;
  background-color: #4f4e4a
}

.main-right>#maincontent {
  background-color: #4f4e4a;
  color: #fafafa
}

.pull-left {
  float: left
}

.warning {
  background-color: #FF7D60!important;
  color: #FFF
}

.alert-message, .errorbox {
  margin: 2rem 0 0;
  padding: 2rem;
  border: 0;
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  font-family: inherit;
  min-width: inherit;
  overflow: auto;
  border-radius: 0;
  background-color: #FFF;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .16), 0 0 2px 0 rgba(0, 0, 0, .12)
}

.errorbox {
  color: #fff;
  background-color: #f0ad4e;
  border-color: #eea236
}

.error {
  color: red
}

#maincontent>.container>div:nth-child(1).alert-message.warning>a {
  font: inherit;
  overflow: visible;
  text-transform: none;
  display: inline-block;
  margin-bottom: 0;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  min-width: 6rem;
  padding: .5rem 1rem;
  font-size: .9rem;
  line-height: 1.42857143;
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da;
  margin-top: 2rem;
  text-decoration: inherit
}

.main>.main-left>.nav>.slide>a.menu.active, .main>.main-left>.nav>li {
  border-bottom: 1px solid #0f0e0a
}

.main>.main-left>.nav>li a {
  color: #d8d3c5;
  display: block
}

.main>.main-left>.nav>.slide>.menu.active, .main>.main-left>.nav>.slide>.slide-menu>.active>a, h2>a, h2>a:hover {
  color: #fafafa
}

.main>.main-left>.nav>li:nth-last-child(1) {
  background: rgba(175, 46, 17, .3);
  margin: 0
}

.main>.main-left>.nav>li:nth-last-child(1) a {
  text-decoration: none
}

.main>.main-left>.nav>li {
  background: url(../img/noise.png) #2f2e2a;
  padding: .5rem 1rem;
  cursor: pointer
}

.main>.main-left>.nav>.slide {
  padding: 0
}

h1, h3 {
  padding-bottom: 10px
}

.main>.main-left>.nav>.slide>ul {
  display: none
}

.main>.main-left>.nav>.slide>.menu {
  display: block;
  padding-left: 1rem;
  text-decoration: none;
  cursor: pointer;
  font-size: 1.1rem;
  line-height: 42px;
  height: 42px
}

.main>.main-left>.nav>.slide>.menu:hover {
  background: url(../img/noise.png) #4f4e4a
}

.main>.main-left>.nav>.slide>.menu.active:hover {
  background: 0 0
}

.main>.main-left>.nav>.slide>.slide-menu>.active {
  background: #4f4e4a!important;
  border-top: 1px solid #63615e!important
}

.main>.main-left>.nav>.slide>.slide-menu.active>li {
  padding-left: 2rem;
  border-top: 1px solid #4c4b48;
  border-bottom: 1px solid #0f0e0a;
  background: url(../img/noise.png) #3f3e3a
}

.main>.main-left>.nav>.slide>.slide-menu.active>li:nth-last-child(1) {
  border-bottom: none
}

.main>.main-left>.nav>.slide>.slide-menu.active>li:hover {
  background: rgba(117, 137, 12, .45)!important;
  border-top: 1px solid rgba(129, 140, 72, .45)
}

.main>.main-left>.nav>.slide>.slide-menu>li>a {
  text-decoration: none;
  white-space: nowrap;
  font-size: .95rem;
  line-height: 41px
}

.main>.main-left>.nav>.slide>.slide-menu>li:hover {
  background: url(../img/noise.png) #3f3e3a
}

.main>.main-left>.nav>.slide>.slide-menu>.active:hover {
  cursor: hand
}

li {
  list-style-type: none
}

#maincontent>.container {
  margin: 0 2rem 1rem
}

h1 {
  font-size: 2rem;
  border-bottom: 1px solid #eee
}

h2 {
  margin: 12px 0 0;
  font-size: 1.6rem;
  line-height: 2.5rem;
  padding-bottom: 12px
}

.panel-title, h3 {
  font-size: 1.4rem
}

h3 {
  margin: 2rem 0 0
}

fieldset {
  margin-bottom: 1rem;
  border: 1px solid rgba(37, 35, 35, .25);
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  font-family: inherit;
  min-width: inherit;
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: 0;
  -webkit-overflow-scrolling: touch;
  background: #2f2e2a
}

.cbi-map-descr+fieldset {
  margin-top: 1rem
}

fieldset>legend {
  display: none!important
}

fieldset>fieldset {
  margin: 0;
  padding: 0;
  border: none;
  box-shadow: none
}

fieldset>button {
  margin: 8px
}

.panel-title {
  display: block;
  line-height: 2.2rem;
  padding-bottom: 0;
  background: #2f2e2a;
  padding-left: 8px;
  border-bottom: 1px solid #1f1e1a;
  border-top: 1px solid #1f1e1a
}

fieldset>.panel-title:nth-of-type(1) {
  border-top: none
}

table {
  border-spacing: 0;
  border-collapse: collapse;
  border: none;
  margin: 0!important
}

.cbi-rowstyle-1, .cbi-rowstyle-2, table>tbody>tr {
  border-bottom: 1px solid #1f1e1a
}

table>tbody>tr>td, table>tbody>tr>th, table>tfoot>tr>td, table>tfoot>tr>th, table>thead>tr>td, table>thead>tr>th {
  padding: .5rem;
  white-space: nowrap
}

table>tbody>tr {
  border-top: 1px solid #3f3e3a
}

.cbi-rowstyle-1 {
  background-color: #3f3e3a;
  border-top: 1px solid #4f4e4a
}

.cbi-rowstyle-2 {
  background-color: #2f2e2a;
  border-top: 1px solid #3f3e3a
}

table>tbody>tr:nth-last-child(1) {
  border-bottom: none
}

#conns>div, #membuff>div, #memfree>div, #memcache>div, #memtotal>div, #swapfree>div, #swaptotal>div {
  width: 100%!important;
  height: 1.2rem!important;
  background: #1f1e1a;
  border: 1px solid #000!important
}

#conns>div>div, #membuff>div>div, #memfree>div>div, #memcache>div>div ,#memtotal>div>div, #swapfree>div>div, #swaptotal>div>div {
  height: 100%!important;
  background-color: rgba(117, 137, 12, .75)!important
}

#conns>div>div>div, #membuff>div>div>div, #memfree>div>div>div, #memcache>div>div>div,#memtotal>div>div>div, #swapfree>div>div>div, #swaptotal>div>div>div {
  color: #fafafa!important;
  line-height: 17px
}

.cbi-value-field table, .cbi-value-field>table>tbody>tr>td, table table, td>table>tbody>tr>td {
  border: none
}

.cbi-button {
  -webkit-appearance: none;
  display: inline-block;
  cursor: pointer;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  vertical-align: middle;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: auto!important;
  color: #d8d3c5;
  font-size: .8rem;
  font-family: DIN;
  font-weight: 700;
  text-shadow: 0 1px 1px #000;
  text-decoration: none;
  border-width: 1px;
  border-radius: 0;
  border-style: solid;
  border-color: #44433f #44433f #3a3935;
  box-shadow: inset 0 0 24px 0 #2f2e2c, 0 0 3px 0 #000;
  background: -webkit-linear-gradient(top, #494744 0, #2f2e2c 100%);
  background: linear-gradient(to bottom, #494744 0, #2f2e2c 100%);
  padding: 5px
}

.cbi-button:active, .cbi-button:focus, .cbi-button:hover {
  outline: 0;
  text-decoration: none;
  color: rgba(0, 0, 0, .87)
}

.cbi-button-apply, .cbi-button-edit, .cbi-button-remove, .cbi-button-reset, .cbi-input-apply, .cbi-input-remove, .cbi-input-reset, .cbi-section-remove>.cbi-button {
  color: #2f2e2a!important;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .62);
  text-transform: uppercase
}

.cbi-button:focus, .cbi-button:hover {
  box-shadow: 0 0 2px rgba(0, 0, 0, .12), 0 2px 2px rgba(0, 0, 0, .2)
}

.cbi-button:active {
  box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23)
}

.cbi-button:disabled {
  cursor: not-allowed;
  pointer-events: none;
  opacity: .6;
  box-shadow: none
}

.zonebadge, header>.container>.pull-right>* {
  cursor: pointer
}

.cbi-button+.cbi-button, form.inline+form.inline {
  margin-left: .6rem
}

.cbi-button-reset, .cbi-input-remove {
  box-shadow: inset 0 0 14px 0 #db4213, 0 0 3px 0 #db6113!important;
  border: 1px solid rgba(255, 129, 92, .65)!important;
  background: #dbb013!important;
  background: -moz-radial-gradient(center, ellipse cover, #dbb013 0, #c69611 100%)!important;
  background: -webkit-radial-gradient(center, ellipse cover, #dbb013 0, #c69611 100%)!important;
  background: radial-gradient(ellipse at center, #dbb013 0, #c69611 100%)!important
}

.cbi-button-add, .cbi-button-find, .cbi-button-reload, .cbi-button-save, .cbi-input-find, .cbi-input-reload, .cbi-input-save {
  color: #2f2e2a!important;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .62);
  text-transform: uppercase;
  box-shadow: inset 0 0 24px 0 #606f11, 0 0 3px 0 #9db134!important;
  border: 1px solid #799037!important;
  background: #7eaa0f!important;
  background: -webkit-radial-gradient(center ellipse, #7eaa0f 0, #6d8006 100%)!important;
  background: radial-gradient(ellipse at center, #7eaa0f 0, #6d8006 100%)!important
}

.cbi-button-apply, .cbi-button-edit, .cbi-input-apply {
  box-shadow: inset 0 0 24px 0 rgba(62, 62, 62, .77), 0 0 4px 0 rgba(236, 232, 219, .75);
  border: 1px solid #969696!important;
  background: #dbb013!important;
  background: -webkit-radial-gradient(center ellipse, #e0dbcf 0, rgba(224, 219, 204, .7) 100%)!important;
  background: radial-gradient(ellipse at center, #e0dbcf 0, rgba(224, 219, 204, .7) 100%)!important
}

.cbi-button-remove, .cbi-input-reset, .cbi-section-remove>.cbi-button {
  box-shadow: inset 0 0 14px 0 #82290e, 0 0 3px 0 #db4213!important;
  border: 1px solid #b73813!important;
  background: #db4213!important;
  background: -moz-radial-gradient(center, ellipse cover, #db4213 0, #c93612 100%)!important;
  background: -webkit-radial-gradient(center, ellipse cover, #db4213 0, #c93612 100%)!important;
  background: radial-gradient(ellipse at center, #db4213 0, #c93612 100%)!important
}

.a-to-btn {
  text-decoration: none
}

.tabs {
  margin: 0 -2rem;
  padding-left: .5rem;
  background-color: #3f3e3a;
  border-bottom: 1px solid #2f2e2a
}

.cbi-tabmenu>li, .tabs>li {
  display: inline-block;
  height: 42px;
  line-height: 42px
}

.cbi-tabmenu>li>a, .tabs>li>a {
  text-decoration: none;
  color: #d8d3c5;
  padding: .5rem .8rem
}

.tabs>li:hover, .tabs>li[class~=active] {
  cursor: pointer;
  border-bottom: .2rem solid rgba(117, 137, 12, .75);
  color: rgba(117, 137, 12, .9)
}

.cbi-tabmenu>li[class~=cbi-tab]>a, .tabs>li[class~=active]>a {
  color: #fafafa
}

.tabs>li:hover {
  border-bottom: .18751rem solid rgba(117, 137, 12, .5)
}

.cbi-tabmenu>li:hover {
  border-bottom: 2px solid #d8d3c5
}

.cbi-tabmenu>li[class~=cbi-tab] {
  border-bottom: 2px solid rgba(117, 137, 12, .85)
}

.cbi-tabmenu {
  background: url(../img/noise.png) #171612
}

.cbi-section-node:nth-of-type(2n), .cbi-section-remove:nth-of-type(2n) {
  background-color: #3f3e3a
}

.cbi-section-node-tabbed {
  padding: 0;
  margin-top: 0;
  background: #3f3e3a
}

.cbi-tabcontainer>.cbi-value:nth-of-type(2n) {
  background-color: #2f2e2a
}

.cbi-value-description, .cbi-value-field {
  display: table-cell;
  line-height: 1.25
}

.cbi-value-helpicon>img {
  display: none
}

.cbi-value-helpicon:before {
  font-family: icomoon;
  color: rgba(117, 137, 12, .5);
  content: "\f059"
}

.cbi-value-description {
  color: #d8d3c5 font-size: small;
  padding: .5rem 0 0
}

.cbi-value-title {
  word-wrap: break-word;
  padding-top: .6rem;
  width: 23rem;
  float: left;
  text-align: right;
  padding-right: 2rem;
  display: table-cell
}

.cbi-value {
  padding: .3rem 1rem;
  display: inline-block;
  width: 100%
}

.cbi-section-table-descr>.cbi-section-table-cell, .cbi-section-table-titles>.cbi-section-table-cell {
  border: none
}

.cbi-rowstyle-2 .cbi-button-down, .cbi-rowstyle-2 .cbi-button-up {
  background-color: #FFF!important
}

.cbi-section-table .cbi-section-table-titles .cbi-section-table-cell {
  width: auto!important
}

.cbi-section-table-titles {
  background: url(../img/noise.png) #292823
}

.cbi-map-descr, .cbi-section-descr {
  padding: .5rem;
  color: #1f1e1a;
  font-size: small;
  background: #6f6e6a;
  text-shadow: none
}

.hidden {
  display: none
}

.left {
  text-align: left!important
}

.right {
  text-align: right!important
}

.inline {
  display: inline
}

.cbi-page-actions {
  padding: 10px;
  border: 1px solid #3f3e3a;
  text-align: right;
  background: url(../img/stripes.svg) #2f2e2a;
  box-shadow: inset 0 0 15px rgba(0, 0, 0, .6)
}

.cbi-value input[type=password], .cbi-value input[type=text], .cbi-value-field .cbi-input-select {
  min-width: 15rem
}

.ifacebadge {
  display: inline-flex;
  padding: .5rem 1rem;
  background: rgba(15, 14, 10, .8);
  box-shadow: inset 0 0 42px 0 #000
}

td>.ifacebadge {
  font-size: .9rem
}

.ifacebadge>img {
  float: right;
  margin: 0 .3rem
}

.cbi-input-textarea {
  width: 100%;
  min-height: 14rem;
  padding: .8rem;
  font-size: .8rem;
  margin-top: 10px
}

#syslog {
  width: 100%;
  min-height: 15rem;
  padding: 1rem;
  font-size: small;
  color: #d8d3c5;
  margin-bottom: 20px;
  border-radius: 0
}

#cbi-apply-uci-apply img {
  display: none
}

#cbi-apply-uci-apply #cbi-apply-uci-apply-status {
  display: block;
  color: #d8d3c5;
  padding: 10px
}

#cbi-apply-uci-apply #cbi-apply-uci-apply-status:before {
  font-family: icomoon;
  content: "\e603";
  animation: anim-rotate 2s infinite linear;
  margin-right: 1rem;
  display: inline-block;
  color: rgba(117, 137, 12, 1)
}

.uci-change-list {
  font-family: monospace;
  padding: 10px;
  color: #fafafa;
  font-size: 14px
}

.uci-change-legend-label ins, .uci-change-list ins {
  text-decoration: none;
  border: 1px solid rgba(117, 137, 12, .75);
  background-color: #505a18;
  display: block;
  padding: 2px
}

.uci-change-legend-label del, .uci-change-list del {
  text-decoration: none;
  border: 1px solid #c93612;
  background-color: rgba(175, 46, 17, .53);
  display: block;
  font-style: normal;
  padding: 2px
}

.uci-change-legend-label var, .uci-change-list var {
  text-decoration: none;
  border: 1px solid #3f3e3a;
  display: block;
  font-style: normal;
  padding: 2px;
  box-shadow: inset 0 0 24px 0 #000;
  background: #1f1e1a
}

.uci-change-list var del, .uci-change-list var ins {
  border: none;
  white-space: pre;
  font-style: normal;
  padding: 0
}

.uci-change-legend {
  padding: 10px
}

.uci-change-legend-label {
  width: 150px;
  float: left
}

.uci-change-legend-label>del, .uci-change-legend-label>ins, .uci-change-legend-label>var {
  float: left;
  margin-right: 4px;
  width: 10px;
  height: 10px;
  display: block
}

.uci-change-legend-label var del, .uci-change-legend-label var ins {
  line-height: 6px;
  border: none
}

.uci-change-list del, .uci-change-list ins, .uci-change-list var {
  padding: .5rem
}

#bwsvg, #iwsvg, #iwsvg2 {
  border: 1px solid #1f1e1a!important;
  border-top: none!important;
  box-shadow: inset 0 0 42px 0 #000;
  background: url(../img/stripes.svg) #1f1e1a!important
}

svg {
  background: rgba(15, 14, 10, .8)!important
}

.ifacebox {
  border: 1px solid #0f0e0a;
  margin: 5px
}

.ifacebox-head {
  line-height: 20px;
  color: #1f1e1a;
  text-shadow: none
}

.ifacebox-body {
  box-shadow: inset 0 0 15px 0 #000;
  background: #1f1e1a;
  min-height: 40px;
  line-height: 18px;
  padding-top: 12px;
  padding-bottom: 8px
}

.cbi-image-button {
  margin-left: .5rem
}

.zonebadge {
  padding: .2rem .5rem;
  display: inline-block
}

.zonebadge>.ifacebadge {
  padding: .2rem 1rem;
  margin: .3rem
}

.zonebadge>input[type=text] {
  padding: .16rem 1rem;
  min-width: 10rem;
  margin-top: .3rem
}

.cbi-value-field .cbi-input-checkbox, .cbi-value-field .cbi-input-radio {
  margin-top: .5rem;
  height: 1rem
}

.cbi-value-field>input+.cbi-value-description {
  padding: 0
}

.cbi-value-field>ul>li {
  display: flex
}

.cbi-value-field>ul>li>label {
  margin-top: .5rem
}

.cbi-value-field>ul>li .ifacebadge {
  margin-left: .4rem;
  margin-top: -.5rem
}

.cbi-section-table-row>.cbi-value-field .cbi-input-select {
  min-width: 7rem
}

.cbi-section-create>.cbi-button-add {
  margin: .5rem
}

.cbi-section-remove {
  padding: .5rem
}

div.cbi-value var, td.cbi-value-field var {
  font-style: italic;
  color: #0069D6
}

small {
  font-size: 90%;
  white-space: normal;
  line-height: 1.42857143
}

.cbi-button-down, .cbi-button-up {
  display: inline-block;
  min-width: 0;
  padding: .2rem .3rem;
  font-size: 1.2rem
}

.cbi-optionals {
  padding: 1rem 1rem 0;
  border-top: 1px solid #CCC
}

#diag-rc-output>pre {
  display: block;
  padding: 8.5px;
  margin: 0 0 18px;
  line-height: 1.5rem;
  white-space: pre-wrap;
  word-wrap: break-word;
  font-size: 1.4rem
}

.darkMask, .node-main-login>.main>.main-left, .showSide {
  display: none
}

.node-main-login>.main fieldset:nth-child(4) td:nth-child(2), .node-status-overview>.main fieldset:nth-child(4) td:nth-child(2), .node-status-processes>.main table tr td:nth-child(3) {
  white-space: normal
}

input[name=ping], input[name=traceroute], input[name=nslookup] {
  width: 80%
}

.darkMask, .node-main-login>.main>.main-right {
  width: 100%
}

#xhr_poll_status>.label.success {
  color: #fafafa!important;
  text-shadow: 0 1px 1px rgba(65, 65, 65, .4)!important;
  box-shadow: inset 0 0 24px 0 #606f11, 0 0 3px 0 #9db134!important;
  border: 1px solid #799037!important;
  background: #7eaa0f!important;
  background: -webkit-radial-gradient(center ellipse, #7eaa0f 0, #6d8006 100%)!important;
  background: radial-gradient(ellipse at center, #7eaa0f 0, #6d8006 100%)!important;
  margin-right: 4px;
  padding: 5px
}

.label {
  color: #d8d3c5!important;
  font-size: .8rem;
  text-shadow: 0 1px 1px #000;
  text-decoration: none;
  border-width: 1px;
  border-radius: 0;
  border-style: solid;
  border-color: #44433f #44433f #3a3935;
  box-shadow: inset 0 0 24px 0 #2f2e2c, 0 0 3px 0 #000;
  background: -webkit-linear-gradient(top, #494744 0, #2f2e2c 100%);
  background: linear-gradient(to bottom, #494744 0, #2f2e2c 100%);
  padding: 5px
}

#modemenu>li .active>.label {
  box-shadow: inset 0 0 24px 0 rgba(62, 62, 62, .77), 0 0 4px 0 rgba(236, 232, 219, .75);
  border: 1px solid #969696!important;
  background: #dbb013!important;
  background: -webkit-radial-gradient(center ellipse, #e0dbcf 0, rgba(224, 219, 204, .7) 100%)!important;
  background: radial-gradient(ellipse at center, #e0dbcf 0, rgba(224, 219, 204, .7) 100%)!important
}

#modemenu>li .active>.label>a {
  color: #d8d3c5!important;
  text-shadow: 0 1px 1px rgba(10, 9, 4, .4)!important
}

.notice {
  background-color: #5BC0DE
}

.darkMask {
  height: 100%;
  position: fixed;
  background-color: rgba(0, 0, 0, .56);
  content: "";
  z-index: 99
}

.node-main-login>.main fieldset {
  padding: .5rem;
  margin-bottom: 1rem;
  display: inline;
  background: 0 0;
  border: none;
  box-shadow: none;
  overflow: hidden;
  width: 100%
}

.node-main-login>.main .cbi-value-title {
  width: 7rem
}

.node-main-login>.main #maincontent {
  text-align: center
}

.node-main-login>.main .container {
  display: inline-block;
  padding: 2rem 4rem;
  margin-top: 3rem!important;
  background-color: #1f1e1a;
  text-align: left;
  border: 1px solid #3f3e3a;
  box-shadow: 0 0 42px 0 rgba(0, 0, 0, .66)
}

.node-main-login fieldset:nth-child(3n) table table tr td, .node-status-overview fieldset:nth-child(3n) table table tr td {
  padding: 7px!important
}

.node-main-login>.main form>div:nth-last-child(1) {
  float: right
}

.node-main-login>.main .cbi-value {
  display: block
}

.node-main-login>.main .cbi-value>* {
  display: inline-block!important
}

.node-main-login>.main .cbi-input-password, .node-main-login>.main .cbi-input-user {
  min-width: 15rem
}

.node-main-login footer {
  bottom: 0;
  position: absolute;
  width: 100%
}

.node-main-login table>tbody>tr {
  background-color: #2f2e2a;
  border-top: 1px solid #3f3e3a;
  border-bottom: 1px solid #1f1e1a
}

.node-main-login table>tbody>tr:nth-of-type(2n) {
  background-color: #3f3e3a;
  border-top: 1px solid #4f4e4a;
  border-bottom: 1px solid #1f1e1a
}

.node-main-login fieldset:nth-child(3n) table table {
  box-shadow: inset 0 0 15px 0 #000;
  background: #1f1e1a;
  border: 1px solid #000
}

.node-main-login fieldset:nth-child(3n) table table tr {
  background: 0 0;
  border: none
}

.node-status-overview table>tbody>tr {
  background-color: #2f2e2a;
  border-top: 1px solid #3f3e3a;
  border-bottom: 1px solid #1f1e1a
}

.node-status-overview table>tbody>tr:nth-of-type(2n) {
  background-color: #3f3e3a;
  border-top: 1px solid #4f4e4a;
  border-bottom: 1px solid #1f1e1a
}

.node-status-overview table>tbody>tr:last-child {
  border: none
}

.node-status-overview fieldset:nth-child(3n) table table {
  box-shadow: inset 0 0 15px 0 #000;
  background: #1f1e1a;
  border: 1px solid #000
}

.node-status-overview fieldset:nth-child(3n) table table tr {
  background: 0 0;
  border: none
}

.node-status-iptables>.main div>.cbi-map>form {
  margin: 2rem 2rem 0 0
}

.cbi-tabmenu+.cbi-section, .node-status-iptables fieldset, .node-system-flashops fieldset, .node-system-packages fieldset {
  margin-top: 0
}

.node-system-reboot>.main>.main-right h3, .node-system-reboot>.main>.main-right p {
  padding-left: 2rem;
  margin-bottom: 8px
}

.node-system-reboot>.main>.main-right p.warning {
  padding: 2rem
}

.node-system-reboot>.main>.main-right p:nth-last-child(1) {
  background: url(../img/stripes.svg) #1f1e1a;
  padding: 2rem
}

.node-services-samba>.main .cbi-tabcontainer:nth-child(3) .cbi-value-title {
  margin-bottom: 1rem;
  width: auto
}

.node-services-samba>.main .cbi-tabcontainer:nth-child(3) .cbi-value-field {
  display: list-item
}

#cbi-processes .cbi-section-descr, #cbi-processes .cbi-section-table-descr, #cbi-system-led .cbi-section-descr, #cbi-system-led br, .node-status-processes .cbi-page-actions, .node-system-flashops br {
  display: none
}

.node-services-samba>.main .cbi-tabcontainer:nth-child(3) .cbi-value-description {
  padding-top: 1rem
}

.node-system-packages>.main table tr td:nth-child(1) {
  width: auto!important
}

.node-system-packages>.main table tr td:nth-last-child(1) {
  white-space: normal;
  font-size: small
}

.node-system-packages>.main .cbi-tabmenu>li>a, .tabs>li>a {
  padding: .5rem .8rem
}

.node-system-packages>.main .cbi-value>pre {
  overflow: auto
}

.node-network-firewall>.main .cbi-section-table-row>.cbi-value-field .cbi-input-select {
  min-width: 4rem
}

.node-status-iptables .cbi-tabmenu, .node-system-flashops .cbi-tabmenu, .node-system-packages .cbi-tabmenu {
  border: none;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .16), 0 0 2px 0 rgba(0, 0, 0, .12)
}

.node-system-flashops form.inline+form.inline {
  margin-left: 0
}

.node-system-flashops .cbi-section-node {
  padding-top: 10px;
  padding-bottom: 10px
}

.node-system-flashops .cbi-input-apply {
  height: 25px;
  margin-top: -5px;
  font-size: .8rem
}

#cbi-firewall-redirect table *, #cbi-firewall-zone table *, #cbi-network-switch_vlan table * {
  font-size: small
}

#cbi-firewall-redirect table input[type=text], #cbi-firewall-zone table input[type=text], #cbi-network-switch_vlan table input[type=text] {
  width: 5rem
}

#cbi-firewall-redirect table select, #cbi-firewall-zone table select, #cbi-network-switch_vlan table select {
  min-width: 3.5rem
}

#cbi-system-led .cbi-section-create, #cbi-system-led .cbi-section-remove {
  background: #1f1e1a;
  border-bottom: 1px solid #0f0e0a;
  border-top: 1px solid #0f0e0a
}

#cbi-processes .cbi-section-table-titles {
  background-color: #1f1e1a;
  border-top: none
}

.node-status-realtime table {
  border: 1px solid #1f1e1a
}

.node-status-realtime table>tbody>tr {
  background-color: #2f2e2a;
  border-top: 1px solid #3f3e3a;
  border-bottom: 1px solid #1f1e1a
}

.node-status-realtime table>tbody>tr:nth-of-type(2n) {
  background-color: #3f3e3a;
  border-top: 1px solid #4f4e4a;
  border-bottom: 1px solid #1f1e1a
}

.node-status-realtime fieldset table {
  border: none
}

.node-status-realtime small {
  display: inline-block;
  width: 100%;
  line-height: 25px;
  background: #1f1e1a;
  border: 1px solid #1f1e1a;
  padding-right: 5px
}

.node-status-realtime #cbi-table-table small {
  border: none
}

.node-status-realtime br, .node-system-admin .cbi-section-table-descr, .node-system-admin .cbi-section-table-titles, .node-system-admin br, .node-system-admin fieldset:nth-of-type(1) .cbi-section-descr, .node-system-startup .cbi-map br, .node-system-startup .cbi-section-descr, .node-system-startup .cbi-section-table-descr, .node-system-startup form:nth-of-type(1) .cbi-page-actions, .node-system-system .cbi-section-descr, .node-system-system fieldset br {
  display: none
}

.node-system-startup .cbi-map-descr br {
  display: block
}

.node-network-bmx7 .cbi-map-descr, .node-network-bmx7 center img, .node-network-dhcp #cbi-dhcp-dnsmasq br, .node-network-dhcp .cbi-section-descr, .node-network-dhcp .cbi-section-table-descr, .node-network-network .cbi-section-descr, .node-network-network fieldset br, .node-system-fstab .cbi-section-descr:nth-of-type(1), .node-system-fstab .cbi-section-table-descr {
  display: none
}

.node-system-flashops fieldset {
  margin-top: 10px;
  padding: 10px
}

.node-network-bmx7 div#extra-info {
  margin-bottom: 15px
}

.node-network-network fieldset .cbi-section-node table {
  box-shadow: inset 0 0 15px 0 #000;
  background: #1f1e1a;
  border: 1px solid #000
}

.node-network-network fieldset .cbi-section-node table tr {
  background: 0 0
}

.node-network-network fieldset .cbi-section-node table td:nth-of-type(1) {
  padding: 5px!important
}

.node-network-network fieldset .cbi-section-node table td, .node-network-wireless fieldset .cbi-section-node table td {
  padding: 10px!important
}

.node-network-network fieldset .cbi-section-table br {
  display: initial
}

.node-network-wireless fieldset br {
  display: none
}

.node-network-wireless fieldset .cbi-section-node table br, .node-network-wireless fieldset .cbi-section-table:nth-of-type(1) br {
  display: initial
}

.node-network-wireless fieldset .cbi-section-node table {
  box-shadow: inset 0 0 15px 0 #000;
  background: #1f1e1a;
  border: 1px solid #000
}

.node-network-wireless fieldset .cbi-section-table tr:nth-of-type(1) {
  background: url(../img/noise.png) #292823
}

.node-network-hosts .cbi-section-descr, .node-network-hosts .cbi-section-table-descr, .node-network-routes .cbi-section-descr {
  display: none
}

.node-network-routes .cbi-input-select {
  width: 100px;
  min-width: 100px
}

.node-network-routes input {
  width: 130px;
  max-width: 150px
}

.node-network-routes td:nth-of-type(5) input, .node-network-routes td:nth-of-type(6) input {
  width: 50px!important;
  max-width: 50px!important
}

body.lang_pl.node-main-login .cbi-value-title {
  width: 12rem
}

.breadcrumb li {
  display: inline-block
}

.info {
  background: 0 0!important
}

pre, textarea {
  border: 1px solid #0f0e0a;
  padding: 15px;
  color: #d8d3c5;
  background: rgba(15, 14, 10, 1);
  box-shadow: inset 0 0 36px 0 rgba(0, 0, 0, .8);
  margin-top: 10px
}

#content_syslog textarea {
  margin-top: 0
}

@media screen and (max-width:1600px) {
  .main-left {
    width: calc(0% + 13rem)
  }
  .main-right {
    width: calc(100% - 13rem)
  }
  .cbi-button {
    padding: .3rem .6rem
  }
  .cbi-value-title {
    width: 15rem;
    padding-right: .6rem
  }
  .cbi-input-textarea {
    font-size: small
  }
  .node-status-iptables>.main fieldset li>a {
    padding: .3rem .6rem
  }
}

@media screen and (max-width:1280px) {
  .main-left {
    width: calc(0% + 13rem);
    top: 3.5rem;
    height: calc(100% - 3.5rem)
  }
  .main-right {
    width: calc(100% - 13rem)
  }
  .cbi-tabmenu>li>a, .tabs>li>a {
    padding: .2rem .5rem
  }
  .panel-title {
    font-size: 1.1rem
  }
  table {
    font-size: .7rem!important;
    width: 100%!important
  }
}

@media screen and (max-width:992px) {
  .main-left {
    width: 0;
    position: fixed;
    z-index: 100
  }
  .main-right {
    width: 100%
  }
  .showSide {
    padding: .1rem;
    margin-right: .5rem;
    display: inline-block;
    line-height: 51px;
    vertical-align: top
  }
  .showSide:before {
    font-family: icomoon;
    content: "\e20e";
    font-size: 1.7rem
  }
  .node-main-login .showSide {
    display: none!important
  }
  .cbi-value-title {
    width: 9rem;
    padding-right: 1rem
  }
  .node-network-diagnostics>.main .cbi-map fieldset>div, .node-network-diagnostics>.main .cbi-map fieldset>div * {
    width: 100%!important
  }
  .node-network-diagnostics>.main .cbi-map fieldset>div input[type=text] {
    margin: 3rem 0 0!important
  }
  .node-network-diagnostics>.main .cbi-map fieldset>div:nth-child(4) input[type=text] {
    margin: 0!important
  }
  .node-network-diagnostics>.main .cbi-map fieldset>div input[type=button], .node-network-diagnostics>.main .cbi-map fieldset>div select {
    margin: 1rem 0 0
  }
  #diag-rc-output>pre {
    font-size: 1rem
  }
  .node-main-login>.main .cbi-value-title {
    text-align: left
  }
}

@media screen and (max-width:480px) {
  body {
    font-size: 1rem
  }
  .tabs {
    margin: 0 -1rem
  }
  #maincontent>.container {
    margin: 0 1rem 1.5rem
  }
  .cbi-value-title {
    width: 100%;
    min-width: 0!important;
    display: block;
    margin-top: 1rem;
    margin-bottom: .5rem;
    text-align: left
  }
  .cbi-value-description, .cbi-value-field {
    width: 100%
  }
  .cbi-value>.cbi-value-field {
    display: inline-block
  }
  .cbi-page-actions>div>input, .mobile-hide {
    display: none
  }
  .cbi-tabmenu>li, .tabs>li {
    padding: .6rem 0
  }
  .cbi-tabmenu>li>a, .tabs>li>a {
    padding: .2rem .3rem;
    font-size: .9rem
  }
  .node-main-login>.main .container {
    padding: .5rem 1rem 2rem
  }
  .node-main-login>.main .cbi-value {
    padding: 0
  }
  .node-main-login>.main form>div:nth-last-child(1) {
    margin-top: 2rem
  }
  .node-main-login>.main .cbi-value-title {
    width: 100%!important;
    font-size: 1.2rem
  }
  .node-main-login>.main fieldset {
    margin: 0;
    padding: .5rem
  }
  h2 {
    font-size: 2rem
  }
  .tabs>li>a, input, select {
    font-size: .9rem
  }
  .panel-title {
    font-size: 1.4rem
  }
  .node-system-packages>.main .cbi-value.cbi-value-last>div {
    width: 100%!important
  }
  .node-system-packages>.main .cbi-value .cbi-value-field input {
    width: 100%
  }
  .node-status-iptables>.main div>.cbi-map>form {
    position: static!important;
    margin: 0 0 2rem;
    padding: 2rem;
    border: 0;
    font-weight: 400;
    font-style: normal;
    line-height: 1;
    font-family: inherit;
    min-width: inherit;
    overflow-x: auto;
    overflow-y: hidden;
    border-radius: 0;
    background-color: #FFF;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .16), 0 0 2px 0 rgba(0, 0, 0, .12);
    -webkit-overflow-scrolling: touch
  }
  .node-status-iptables>.main div>.cbi-map>form input[type=submit] {
    width: 100%!important;
    margin: 0
  }
  .node-status-iptables>.main div>.cbi-map>form input[type=submit]+input[type=submit] {
    margin-top: 1rem
  }
}

@media screen and (min-width:992px) {
  .cbi-value input[type=password], .cbi-value input[type=text], .cbi-value-field .cbi-input-select {
    min-width: 20rem
  }
}

@media screen and (min-width:1280px) {
  .cbi-value input[type=password], .cbi-value input[type=text], .cbi-value-field .cbi-input-select {
    min-width: 22rem
  }
}

@media screen and (min-width:1600px) {
  .cbi-value input[type=password], .cbi-value input[type=text], .cbi-value-field .cbi-input-select {
    min-width: 25rem
  }
}
